import type { Component, Directive } from 'vue'
import { createApp } from 'vue'
import App from './App.vue'
import * as directives from './directives/index'
import { getPlatformConfig } from './hook/useConfig'
import router from './router'
import { initRouter } from './router/utils'
import { setupStore } from './stores'
import 'animate.css'
import '~/styles/index.scss'
import 'uno.css'
import 'element-plus/theme-chalk/src/message.scss'
import 'md-editor-v3/lib/style.css'
import 'element-plus/theme-chalk/src/message-box.scss'
import 'tippy.js/dist/tippy.css'
import 'element-plus/dist/index.css'
import 'vue-cropper/dist/index.css'

const app = createApp(App as Component)
setupStore(app)

// 自定义指令
Object.keys(directives).forEach((key) => {
  app.directive(key, (directives as { [key: string]: Directive })[key])
})

// 获取平台配置
getPlatformConfig().then(async (res) => {
  if (useUserStoreHook().accessToken !== '') {
    initRouter().then(async () => {
      await useUserStoreHook().setLoginUserInfo()
    })
  }
  app.config.globalProperties.$config = res
  // 注册store
  app.use(router)
  app.mount('#app')
})
